{template 'common/header'}
<style type="text/css">
    .xh-toast-block{ min-width: 300px; position:fixed; z-index: 9999; font-size: 18px; color: #e7e7e7; padding: 10px 20px; background: rgba(0,0,0,0.7); left: 50%; top: 50%; line-height: 40px; border-radius: 10px; text-align: center; margin-top: -30px; margin-left: -150px; }
    .modeladd li{  padding-top: 5px;  padding-bottom: 5px;  list-style: none;  width: 100%;  float: left;  }
</style>
<ul class="nav nav-tabs">
    <li {if $op == 'category'}class="active"{/if}>
        <a href="{php echo $this->createWebUrl('consultation',array('op'=>'category'))}" >文章分类</a>
    </li>
    <li {if $op == 'article'}class="active"{/if}>
        <a href="{php echo $this->createWebUrl('consultation',array('op'=>'article'))}" >文章列表</a>
    </li>
    <li {if $op == 'createarticle'}class="active"{/if}>
        <a href="{php echo $this->createWebUrl('consultation',array('op'=>'createarticle'))}" >{if empty($articleid)}创建文章{else}修改文章{/if}</a>
    </li>
</ul>
{if $op == 'category'}
{if $oop == 'list'}
{if $num < 5}
<a href="#category"  class="btn btn-success" data-toggle="modal"  style="float:right;margin: 15px"><span onclick="clear11()">添加分类</span></a>
{/if}
<table class="table table-bordered table-hover" align="center">
    <thead>
    <tr>
        <th>
            {if $paixu == 2}
            <a href="{php echo $this->createWebUrl('consultation',['op'=>'category','oop'=>'list','paixu'=>1])}">
                排序 <img src="{php echo MODULE_URL.'images/up.png'}" alt="" style="height: 14px;">
            </a>
            {elseif $paixu == 1}
            <a href="{php echo $this->createWebUrl('consultation',['op'=>'category','oop'=>'list','paixu'=>2])}">
                排序 <img src="{php echo MODULE_URL.'images/down.png'}" alt="" style="height: 14px;">
            </a>
            {/if}
        </th>
        <th>分类名称</th>
        <th>状态</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    {loop $list $row}
    <tr>
        <td id="{$row['id']}" class="cpaixu">{$row['order']}</td>
        <td>{$row['name']}</td>
        <td style="width:15%"><div class="btn {if $row['status'] == 0}btn-danger{else}btn-info{/if}" data="{$row['id']}" onclick="changestatus(this)">{if $row['status'] == 0}不显示{elseif $row['status'] == 1}显示{/if}</div></td>
        <td>
            <div class="btn-group">
                <a href="#category" class="btn btn-info" data-toggle="modal" onclick="edit({$row['id']})">修改</a>
                <a href="{php echo $this->createWebUrl('consultation',array('op'=>'category','oop'=>'delete','cid'=>$row['id']))}" class="btn btn-danger">删除</a>
            </div>
        </td>
    </tr>
    {/loop}
    </tbody>
</table>
<script type="text/javascript">

    $(function(){
        $('.cpaixu').click(function(){
            if(!$(this).is('.input')){
                $(this).addClass('input').html('<input type="text" id="'+ $(this).attr("id") +'" style="width: 50px;" value="'+ $(this).text() +'" />').find('input').focus().blur(function(){
                    var order=$(this).val();
                    var id=$(this).attr("id");
                    $.ajax({
                        type: 'POST',
                        url: "{php echo $this->createWebUrl('consultation',array('op'=>'category','oop'=>'sort'))}",
                        data: {cid:id,order:order},
                        success:function(res){
                            var res = JSON.parse(res);
                            location.reload();
                        }
                    });
                    $(this).parent().removeClass('input').html($(this).val() || 0);
                });
            }
        }).hover(function(){
            $(this).addClass('hover');
        },function(){
            $(this).removeClass('hover');
        });


    });

</script>
<div class="modal fade" id="category" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <form action="./index.php" method="post">
            <input type="hidden" name="c" value="site">
            <input type="hidden" name="a" value="entry">
            <input type="hidden" name="m" value="goouc_class">
            <input type="hidden" name="do" value="consultation">
            <input type="hidden" name="op" value="category">
            <input type="hidden" name="oop" value="add">
            <input type="hidden" name="categoryid" id="categoryid" value="">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title" id="city">
                        添加分类
                    </h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label  class="col-sm-2 control-label">名称</label>
                        <div class="col-sm-10">
                            <input type="text" name="name" id="categoryname" value=""  placeholder=""  class="form-control" maxlength="5" style="width:98%"/>
                            <span class="help-block">分类名称最大5个字符</span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label  class="col-sm-2 control-label">排序</label>
                        <div class="col-sm-10">
                            <input type="number" name="order" id="categoryorder" value="0"  placeholder="" oninput="console.log(123456);if($(this).val() >99){$(this).val(99)}" class="form-control" style="width:98%"/>
                            <span class="help-block">数字越大排序越靠前，最大为99</span>
                        </div>
                    </div>
                    <div class="form-group ">
                        <label  class="col-sm-2 control-label">分类状态</label>
                        <div class=" col-sm-10" style="padding-left:25px">
                            <label class="radio-inline">
                                <input type="radio" name="status" id="status0" value="0" title="不显示"> 不显示
                            </label>
                            <label class="radio-inline">
                                <input type="radio" name="status" id="status1" value="1" title="显示" > 显示
                            </label>
                            <span class="help-block">若不选择，默认为不显示</span>
                        </div>
                    </div>
                </div>
                <input type="hidden" name="token" value="{$_W['token']}">
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <input type="submit" name="submit" value="保存" class="btn btn-info">
                </div>
            </div>
        </form>
    </div>
</div>
<script type="text/javascript">
    //修改状态
    function changestatus(_obj){
        var obj = $(_obj);
        var id = obj.attr('data');
        if(obj.hasClass('btn-danger')){
            var sta = 1;
        }else{
            var sta = 0;
        }
        $.ajax({
            type:'post',
            url:"{php echo $this->createWebUrl('consultation',array('op'=>'category','oop'=>'changestatus'))}",
            data:{cid:id,sta:sta},
            success:function(res){

                var res = JSON.parse(res);
                console.log(res);
                if(res.success == 1){
                    if(sta == 1){
                        obj.removeClass('btn-danger');
                        obj.addClass('btn-info');
                        obj.html('显示');
                    }else{
                        obj.removeClass('btn-info');
                        obj.addClass('btn-danger');
                        obj.html('不显示');
                    }
                }else{
                    xhToast(res.msg);
                }
            }
        });
    }
    function clear11(){
        console.log(132546);
        $('#categoryname')[0].value = '';
        $('#categoryorder')[0].value = 0;
        $('#status0')[0].checked = true;
        $('#status1')[0].checked = false;
        $('#city').html('添加分类');
    }
    function edit(cid){
        var categoryname = $('#categoryname');
        var categoryorder = $('#categoryorder');
        var status0 = $('#status0');
        var status1 = $('#status1');
        var categoryid = $('#categoryid');
        status0.prop('checked','false');
        status1.prop('checked','false');
        $.get(
            './index.php?c=site&a=entry&m=goouc_class&do=consultation&op=category&oop=add',
            {cid:cid},
            function(res){
                console.log(res);
                categoryname.val(res.name);
                categoryorder.val(res.order);
                categoryid.val(res.id);
                $('#city').html('修改分类信息');
                if(res.status == 0){
                    status0.prop('checked','true');
                }
                if(res.status == 1){
                    status1.prop('checked','true');
                }
            },"JSON"
        );
    }
</script>
{/if}
{elseif $op == 'article'}
<table class="table table-bordered table-hover" style="table-layout:fixed;margin-top: 20px;" align="center">
    <thead>
    <tr>
        <th>
            {if $paixu == 2}
            <a href="{php echo $this->createWebUrl('consultation',['op'=>'article','paixu'=>1])}">
                排序 <img src="{php echo MODULE_URL.'images/up.png'}" alt="" style="height: 14px;">
            </a>
            {elseif $paixu == 1}
            <a href="{php echo $this->createWebUrl('consultation',['op'=>'article','paixu'=>2])}">
                排序 <img src="{php echo MODULE_URL.'images/down.png'}" alt="" style="height: 14px;">
            </a>
            {/if}
        </th>
        <th width="30%">文章标题</th>
        <th>文章分类</th>
        <th>缩略图</th>
        <th>状态</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    {loop $list $row}
    <tr>
        <td id="{$row['id']}" class="apaixu">{$row['order']}</td>
        <td style="overflow:hidden;word-break:keep-all;white-space:nowrap;text-overflow:ellipsis;">{$row['title']}</td>
        <td>{$row['cname']}</td>
        <td style="text-align: center"><img src="{php echo $_W['attachurl'].$row['image'];}" alt="" height="40px"></td>
        <td style="width:15%"><div class="btn {if $row['status'] == 0}btn-danger{else}btn-info{/if}" data="{$row['id']}" onclick="changestatus(this)">{if $row['status'] == 0}不显示{elseif $row['status'] == 1}显示{/if}</div>
            <div class="btn {if $row['recommond'] == 0}btn-danger{else}btn-info{/if}" data="{$row['id']}" onclick="recommond(this)">{if $row['recommond'] == 0}不推荐{elseif $row['recommond'] == 1}推荐{/if}</div></td>
        <td>
            <div class="btn-group">
                <a href="{php echo $this->createWebUrl('consultation',array('op'=>'createarticle','articleid'=>$row['id']))}" class="btn btn-info" >修改</a>
                <a href="{php echo $this->createWebUrl('consultation',array('op'=>'deletearticle','articleid'=>$row['id']))}" class="btn btn-danger">删除</a>
            </div>
        </td>
    </tr>
    {/loop}
    </tbody>

</table>
{$page}
<script type="text/javascript">
    //修改状态
    function changestatus(_obj){
        var obj = $(_obj);
        var id = obj.attr('data');
        if(obj.hasClass('btn-danger')){
            var sta = 1;
        }else{
            var sta = 0;
        }
        $.ajax({
            type:'post',
            url:"{php echo $this->createWebUrl('consultation',array('op'=>'changestatus'))}",
            data:{aid:id,sta:sta},
            success:function(res){

                var res = JSON.parse(res);
                console.log(res);
                if(res.success == 1){
                    if(sta == 1){
                        obj.removeClass('btn-danger');
                        obj.addClass('btn-info');
                        obj.html('显示');
                    }else{
                        obj.removeClass('btn-info');
                        obj.addClass('btn-danger');
                        obj.html('不显示');
                    }
                }else{
                    alert(res.mess);
                }
            }
        });
    }

    function recommond(_obj){
        var obj = $(_obj);
        var id = obj.attr('data');
        if(obj.hasClass('btn-danger')){
            var sta = 1;
        }else{
            var sta = 0;
        }
        $.ajax({
            type:'post',
            url:"{php echo $this->createWebUrl('consultation',array('op'=>'recommend'))}",
            data:{aid:id,sta:sta},
            success:function(res){
                var res = JSON.parse(res);
                console.log(res);
                if(res.success == 1){
                    if(sta == 1){
                        obj.removeClass('btn-danger');
                        obj.addClass('btn-info');
                        obj.html('推荐');
                    }else{
                        obj.removeClass('btn-info');
                        obj.addClass('btn-danger');
                        obj.html('不推荐');
                    }
                }else{
                    alert(res.mess);
                }
            }
        });
    }
    $(function(){
        $('.apaixu').click(function(){
            if(!$(this).is('.input')){
                $(this).addClass('input').html('<input type="text" id="'+ $(this).attr("id") +'" style="width: 50px;" value="'+ $(this).text() +'" />').find('input').focus().blur(function(){
                    var order=$(this).val();
                    var id=$(this).attr("id");
                    $.ajax({
                        type: 'POST',
                        url: "{php echo $this->createWebUrl('consultation',array('op'=>'sort'))}",
                        data: {aid:id,order:order},
                        success:function(res){
                            var res = JSON.parse(res);
                            location.reload();
                        }
                    });
                    $(this).parent().removeClass('input').html($(this).val() || 0);
                });
            }
        }).hover(function(){
            $(this).addClass('hover');
        },function(){
            $(this).removeClass('hover');
        });
    });
</script>
{elseif $op == 'createarticle'}
<div class="list-group">
    <p href="#" class="list-group-item" style="background-color: #D9EDF7;border:1px solid #D9EDF7;color:#31708F">文章管理</p>
    <div active="list-group-item " style="border:1px solid #cecece">
        <form action="" method="post" class="form-horizontal" style="margin: 0 150px 0 50px;">
            <div class="form-group" style="margin-top:25px">
                <label  class="col-sm-2 control-label"><span style="color: red;">*</span>文章标题</label>
                <div class="col-sm-10">
                    <input type="text" name="title" value="{$info['title']}" class="form-control" style="width:98%"/>
                    <span class="help-block"></span>
                </div>
            </div>
            <!--  待定-->
            <div class="form-group" style="margin-top:25px">
                <label  class="col-sm-2 control-label"><span style="color: red;">*</span>文章封面图</label>
                <div class="col-sm-10">
                    <div style="width:98%">
                        {php echo tpl_form_field_image('image',$info['image'])}
                    </div>
                    <span class="help-block">建议图片尺寸：88*88</span>
                </div>
            </div>
            <div class="form-group" style="margin-top:25px">
                <label  class="col-sm-2 control-label"><span style="color: red;">*</span>文章分类</label>
                <div class="col-sm-10">
                    <select  name="cid"  style="width:98%">
                        <option value="">--请选择分类--</option>
                        {loop $categorylist $row}
                            <option value="{$row['id']}" {if $row['id'] == $info['cid']}selected{/if}>{$row['name']}</option>
                        {/loop}
                    </select>
                    <span class="help-block">文章分类，默认分类</span>
                </div>
            </div>

            <div class="form-group" style="margin-top:25px">
                <label  class="col-sm-2 control-label"><span style="color: red;">*</span>文章内容</label>
                <div class="col-sm-10">
                    <div style="width:98%">
                        {php echo tpl_ueditor('content',$info['content']);}
                    </div>
                    <span class="help-block"></span>
                </div>
            </div>

            <div class="form-group ">
                <label  class="col-sm-2 control-label">文章状态</label>
                <div class=" col-sm-10" style="padding-left:25px">
                    <label class="radio-inline">
                        <input type="radio" name="status"  value='1' title="显示" {if $info['status'] == '1'}checked{/if}> 显示
                    </label>
                    <label class="radio-inline">
                        <input type="radio" name="status"  value='0' title="不显示" {if empty($info['id'])}checked{/if} {if $info['status'] == '0'}checked{/if}> 不显示
                    </label>
                    <span class="help-block">若不选择，默认为不显示</span>
                </div>
            </div>
            <div class="form-group" style="margin-top:25px">
                <label class="col-sm-2 control-label">排序</label>
                <div class="col-sm-10">
                    <input type="number" name="order" value="{if empty($info['order'])}0{else}{$info['order']}{/if}"    class="form-control" style="width:98%"/>
                    <span class="help-block	">请填写0到100的数字，数字越大排序越靠前</span>
                </div>
            </div>
            <input type="hidden" name="token" value="{$_W['token']}">
            <div style="float: right;margin:10px">
                <input type="submit" name="submit" value="保存设置" class="btn btn-info" onclick="return check();">
            </div>
            <div style="clear: both;"></div>
        </form>
    </div>
</div>
<script>
    function check() {
        var flag = true;
        if($('input[name="title"]').val() == ''){
            flag = false;
            xhToast('请填写文章标题');
            return flag;
        }
        if($('select[name="cid"]').val() == ''){
            flag = false;
            xhToast('请选择文章分类');
            return flag;
        }
        if($('input[name="image"]').val() == ''){
            flag = false;
            xhToast('请设置文章封面图');
            return flag;
        }
        if($('input[name="content"]').val() == ''){
            flag = false;
            xhToast('请填写文章内容');
            return flag;
        }
        return flag;
    }

</script>
{/if}
<script>
    //公用提示窗
    function xhToast(_text){
        $('body').append("<div class='xh-toast-block'>"+_text+"</div>");
        setTimeout(function(){
            $('.xh-toast-block').remove();
        },2000);
    }
</script>
{template 'common/footer'}
